<!-- 第一行数字板块 -->
<template>
  <div class="number-block" style="width: 100%; height: 100%;" align="bottom">
    <el-row style="width: 100%; height: 10%">
      <el-col :span="8"><span class="title">{{ props.title }}</span></el-col>
      <el-col :span="16"><span class="unit">{{ props.unit }}</span></el-col>
    </el-row>
    <el-row class="content" style="width: 100%; height: 90%">
      <!-- 插入模板 -->
      <slot></slot>
    </el-row>
  </div>
</template>

<script setup>
const props = defineProps({ title: { type: String, default: '' }, unit: { type: String, default: '' } })
</script>

<style scoped>
.title {
  padding-left: 6px;
  font-size: 24px;
  font-weight: 600;
}

.unit {
  font-size: 20px;
  color: #AEAEB2;
  font-weight: 500;
}
</style>
